.chart-linter-extend-container {
  .row {
    display: flex;
    flex-direction: row;
    align-items: baseline;
    > * {
      margin-right: 24px;
    }
  }
  
  .column {
    display: flex;
    flex-direction: column;
    > * {
      margin-bottom: 16px;
    }
  }

  .code-textarea {
    width: 700px;
    min-height: 260px;
    max-height: 300px;
    resize: none;
    word-wrap: break-word;
    overflow-y: scroll;
    padding: 8px;
    margin: 10px 20px;
  }
  
  .chart-code-wrapper {
    height: 300px;
    width: 100%;
    display: flex;
    flex-direction: row;
  
    .chart {
      min-width: 300px;
      width: 600px;
      min-height: 300px;
      display: flex;
      align-items: center;
      > * {
        margin: 0 auto;
      }
    }
  
    .code {
      width: 100%;
    }
  }
  
  .linter-wrapper {
    height: 300px;
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
  }
}